<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%
    String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort() + request.getContextPath() + "/";
%>
<!DOCTYPE html>
<html>
<head>
    <base href="<%=basePath%>">
    <meta charset="UTF-8">
    <title>查询库存</title>
    <head>
        <link href="../../jquery/bootstrap_3.3.0/css/bootstrap.min.css" type="text/css" rel="stylesheet" />
        <script type="text/javascript" src="../../jquery/jquery-1.11.1-min.js"></script>
        <script type="text/javascript" src="../../jquery/bootstrap_3.3.0/js/bootstrap.min.js"></script>
        <link rel="stylesheet" type="text/css" href="../../jquery/bs_pagination/jquery.bs_pagination.min.css">
        <script type="text/javascript" src="../../jquery/bs_pagination/jquery.bs_pagination.min.js"></script>
        <script type="text/javascript" src="../../jquery/bs_pagination/en.js"></script>
        <script type="application/javascript" src="../../jquery/commons/common.js"></script>
        <link href="../../jquery/bootstrap-datetimepicker-master/css/bootstrap-datetimepicker.min.css" type="text/css" rel="stylesheet" />
        <script type="text/javascript" src="../../jquery/bootstrap-datetimepicker-master/js/bootstrap-datetimepicker.js"></script>
        <script type="text/javascript" src="../../jquery/bootstrap-datetimepicker-master/locale/bootstrap-datetimepicker.zh-CN.js"></script>
        <script type="text/javascript">
            $(function () {
                //时间组件
                $(".time").datetimepicker({
                    minView: "month",
                    language:  'zh-CN',
                    format: 'yyyy-mm-dd',
                    autoclose: true,
                    todayBtn: true,
                    pickerPosition: "bottom-left"
                });

                //为全选的复选框绑定事件，触发全选操作
                $("#qx").click(function () {

                    $("input[name=xz]").prop("checked",this.checked);

                });

                //获取服务类型，并赋值
                getCstType();
                function getCstType() {
                    $.ajax({
                        url : "service/getTypeService",
                        type : "get",
                        dataType : "json",
                        success : function (data) {

                            var html = "<option></option>";

                            //遍历出来的每一个n，就是每一个user对象
                            $.each(data,function (i,n) {
                                html += "<option value='"+n.cstTypeId+"'>"+n.typeName+"</option>";
                            });

                            $("#service-type").html(html);

                        }

                    });
                }

                //对创建人下拉框赋值
                function getSysUserList(){
                    $.ajax({

                        url : "sysUser/getSysUserList",
                        type : "get",
                        dataType : "json",
                        success : function (data) {

                            var html = "<option></option>";

                            //遍历出来的每一个n，就是每一个user对象
                            $.each(data,function (i,n) {
                                html += "<option value='"+n.userId+"'>"+n.userName+"</option>";
                            });

                            $("#distribution-creater").html(html);
                        }

                    });
                }
                getSysUserList();

                $("#chuliBtn").click(function () {
                    var $xz = $("input[name=xz]:checked");
                    if($xz.length==0){
                        alert("请选择需要处理的记录");
                    }else if($xz.length>1) {
                        alert("只能选择一条需要处理的记录");
                        //肯定只选了一条
                    }else {
                        window.location.href = 'workbench/service/servicehandle.jsp?svrId=' + $xz.val();
                    }
                });

                $("#createBtn").click(function () {
                    var $xz = $("input[name=xz]:checked");
                    var svrId = $xz.val();
                    $.ajax({
                        url: "distribution/updateDistribution",
                        data: {
                            "svrId": svrId,
                            "svrDueId": $.trim($("#distribution-creater").val())
                        },
                        type: "post",
                        dataType: "json",
                        success: function (data) {
                            if (data.success) {
                                //保存客户成功之后，会进行一次页面刷新，刷新出保存的用户，根据创建时间来进行排序
                                pageList(1, $("#fenpeiPage").bs_pagination('getOption', 'rowsPerPage'));
                                $("#fenpeiForm")[0].reset();
                                //关闭添加操作的模态窗口
                                $("#fenpeiModal").modal("hide");
                            } else {
                                alert("分配失败");
                            }
                        }

                    })
                });

                //为删除按钮绑定事件，执行市场活动删除操作
                $("#deleteBtn").click(function () {
                    //找到复选框中所有挑√的复选框的jquery对象
                    var $xz = $("input[name=xz]:checked");
                    if($xz.length==0){
                        alert("请选择需要删除的记录");
                        //肯定选了，而且有可能是1条，有可能是多条
                    }else{
                        if(confirm("确定删除所选中的记录吗？")){
                            //拼接参数
                            var param = "";
                            //将$xz中的每一个dom对象遍历出来，取其value值，就相当于取得了需要删除的记录的id
                            for(var i=0;i<$xz.length;i++){
                                param += "svrId="+$($xz[i]).val();
                                //如果不是最后一个元素，需要在后面追加一个&符
                                if(i<$xz.length-1){
                                    param += "&";
                                }
                            }
                            $.ajax({
                                url : "distribution/delete",
                                data : param,
                                type : "post",
                                dataType : "json",
                                success : function (data) {
                                    if(data.success){
                                        pageList(1,$("#chuliPage").bs_pagination('getOption', 'rowsPerPage'));
                                    }else{
                                        alert("删除服务失败");
                                    }
                                }
                            })
                        }
                    }
                });


                //为查询按钮绑定事件，触发pageList方法
                $("#searchBtn").click(function () {
                    /*
                        点击查询按钮的时候，我们应该将搜索框中的信息保存起来,保存到隐藏域中
                     */
                    $("#hidden-name").val($.trim($("#search-name").val()));
                    var name = $("#search-name").val();
                    pageList(1,2);
                });

                //进入客户管理页面，我们需要进行一次分页查询
                pageList(1,2);

                //用来处理分页请求
                function pageList(pageNo,pageSize) {

                    //将全选的复选框的√干掉
                    $("#qx").prop("checked",false);

                    //查询前，将隐藏域中保存的信息取出来，重新赋予到搜索框中
                    $("#search-name").val($.trim($("#hidden-name").val()));
                    $.ajax({
                            //由于需要的数据和服务分配是差不多的我们这里直接选择使用服务分配的分页
                            url: "selectstock/"+pageNo+"/"+pageSize,
                            type: "get",
                            dataType: "json",
                            success: function (data) {

                                var html = "";

                                //每一个n就是每一个市场活动对象
                                $.each(data.dataList, function (i, n) {

                                    html += '<tr class="active">';
                                    html += '<td>'+n.stkId+'</td>';
                                    html += '<td>'+n.stkProdId+'</td>';
                                    html += '<td>'+n.stkWarehouse+'</td>';
                                    html += '<td>'+n.stkWare+'</td>';
                                    html += '<td>'+n.stkCount+'</td>';
                                    html += '<td>'+n.stkMemo+'</td>';
                                    html += '</tr>';

                                });

                                $("#stockBody").html(html);
                                //计算总页数
                                var totalPages = data.total%pageSize==0?data.total/pageSize:parseInt(data.total/pageSize)+1;
                                //数据处理完毕后，结合分页查询，对前端展现分页信息
                                $("#stockPage").bs_pagination({
                                    currentPage: pageNo, // 页码
                                    rowsPerPage: pageSize, // 每页显示的记录条数
                                    maxRowsPerPage: 20, // 每页最多显示的记录条数
                                    totalPages: totalPages, // 总页数
                                    totalRows: data.total, // 总记录条数

                                    visiblePageLinks: 3, // 显示几个卡片

                                    showGoToPage: true,
                                    showRowsPerPage: true,
                                    showRowsInfo: true,
                                    showRowsDefaultInfo: true,

                                    //该回调函数时在，点击分页组件的时候触发的
                                    onChangePage: function (event, data) {
                                        pageList(data.currentPage, data.rowsPerPage);
                                    }
                                });

                            }
                        }
                    )}


                Date.prototype.format = function(fmt) {
                    var o = {
                        "M+" : this.getMonth() + 1, // 月份
                        "d+" : this.getDate(), // 日
                        "h+" : this.getHours(), // 小时
                        "m+" : this.getMinutes(), // 分
                        "s+" : this.getSeconds(), // 秒
                        "q+" : Math.floor((this.getMonth() + 3) / 3), // 季度
                        "S" : this.getMilliseconds()
                        // 毫秒
                    };
                    if (/(y+)/.test(fmt))
                        fmt = fmt.replace(RegExp.$1, (this.getFullYear() + "")
                            .substr(4 - RegExp.$1.length));
                    for ( var k in o)
                        if (new RegExp("(" + k + ")").test(fmt))
                            fmt = fmt.replace(RegExp.$1, (RegExp.$1.length == 1) ? (o[k])
                                : (("00" + o[k]).substr(("" + o[k]).length)));
                    return fmt;
                }

            });
</script>
<body>

<div>
    <div style="position: relative; left: 10px; top: -10px;">
        <div class="page-header">
            <h3>查询库存</h3>
        </div>
    </div>
</div>

<div style="position: relative; top: -20px; left: 0px; width: 100%; height: 100%;">

    <div style="width: 100%; position: absolute;top: 5px; left: 10px;">

        <div class="btn-toolbar" role="toolbar" style="height: 80px;">
            <form class="form-inline" role="form" style="position: relative;top: 8%; left: 5px;">

                <div class="form-group">
                    <div class="input-group">
                        <div class="input-group-addon">产品</div>
                        <input class="form-control" type="text" id="search-name">
                    </div>
                </div>

                <div class="form-group">
                    <div class="input-group">
                        <div class="input-group-addon">库存</div>
                        <input class="form-control" type="text" id="search-stock">
                    </div>
                </div>

                <button type="submit" class="btn btn-default" id="searchBtn">查询</button>

            </form>
        </div>


        <div style="position: relative;top: 10px;">
            <table class="table table-hover">
                <thead>
                <tr style="color: #B3B3B3;">
                    <td>编号</td>
                    <td>产品</td>
                    <td>仓库</td>
                    <td>货位</td>
                    <td>件数</td>
                    <td>备注</td>
                </tr>
                </thead>
                <tbody id="stockBody">
                </tbody>
            </table>
        </div>

        <div style="height: 50px; position: relative;top: 30px;">
            <div id="stockPage"></div>
        </div>

    </div>
</div>

</body>
</html>
